﻿@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Index.cshtml";
}
@using Newtouch.OR.ManageSystem.Infrastructure
<style>
    * {
        box-sizing: border-box;
    }
    /* 将正文和文档的高度设置为100%，以启用“整页选项卡” */
    body,
    html {
        height: 100%;
        margin: 0;
        font-family: Arial;
    }

    .heightfull {
        height: 100%;
    }

    .container {
        background-color: #ffffff !important;
        height: 100vh; /*元素的高度与 window 的高度相同*/
    }

    /* 样式选项卡链接 */
    .tablink {
        background-color: #C1CDCD;
        color: black;
        float: left;
        border: none;
        outline: none;
        cursor: pointer;
        padding: 14px 16px;
        font-size: 17px;
        width: 100%;
        font-weight: bold;
    }

        .tablink:hover {
            background-color: #C1CDCD;
        }

    /* 设置选项卡内容的样式（并添加高度：全页内容为100%） */
    .tabcontent {
        color: black;
        display: none;
        /* padding: 100px 20px;*/
        height: 100%;
    }

    #arrange {
        background-color: #daebe885;
        /*        background-color: #cfe0e8;
    */
    }

    #register {
        background-color: #b7d7e8;
    }

    .title {
        font-weight: bold;
        font-size: 14px;
        color: #00a0ea;
        padding-top: 15px;
        width: 100%;
        text-align: center;
    }

    /*    .patcard {
            padding-left: 0;
            border: 2px solid #c1cdcda5;
            background-color: #ffffff85;
            border-radius: 4px;
            width: 98%;
        }*/
    .showContentlabel {
        font-size: 14px;
        font-weight: bold;
        padding-top: 5px;
        text-align: right;
    }

    .showContent {
        text-align: left;
        font-size: 14px;
        padding-top: 5px;
        /* border: none;*/
        width: 95%;
    }

    .panel-title {
        font-size: 16px;
        font-weight: bold;
        padding: 10px 10px;
    }

    .select2-container--default.select2-container--disabled .select2-selection--multiple {
        background-color: #daebe885 !important;
        font-size: 14px;
    }
    .btnopr {
        margin: 2px 3px;
    }
</style>
<div class="container heightfull">
    <div class="row heightfull">
        <div class="col-sm-4 heightfull" style="background-color: #daebe885; ">
            <div class="panel panel-danger" style="height:40%;">
                <div class="panel-heading">
                    <h3 class="panel-title">患者信息</h3>
                </div>
                <div class="panel-body">
                    @Html.Partial("_PatientCard")
                </div>
            </div>
            <div class="panel panel-info" style="width: 100%; height: 55%;  ">
                <div class="panel-heading">
                    <h3 class="panel-title">手术申请详情</h3>
                </div>
                <div class="panel-body">
                    <form id="formapplyinfo" class="form-horizontal" role="form" style="height:100%;">
                        <div class="form-group">
                            <label for="applyno" class="col-sm-4 showContentlabel">
                                手术申请单号
                            </label>
                            <div class="col-sm-8">
                                <input id="applyno" class="showContent" type="text" value="" disabled>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="ssmcn" class="col-sm-4 showContentlabel">
                                申请手术名称
                            </label>
                            <div class="col-sm-8">
                                <input id="ssmcn" class="showContent" type="text" value="" disabled>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="ysxm" class="col-sm-4 showContentlabel">
                                申请主刀医生
                            </label>
                            <div class="col-sm-8">
                                <input id="ysxm" class="showContent" type="text" value="" disabled>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="sssj" class="col-sm-4 showContentlabel">
                                申请手术时间
                            </label>
                            <div class="col-sm-8">
                                <input id="sssj" class="showContent" type="text" value="" disabled>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="sqzt" class="col-sm-4 showContentlabel">
                                申请状态
                            </label>
                            <div class="col-sm-8">
                                <input id="sqzt" class="showContent" type="text" value="" disabled>
                            </div>
                        </div>
                    </form>

                </div>
            </div>
        </div>
        <div class="col-sm-8 heightfull">
            <button class="tablink" onclick="openPage('arrange', this, '#daebe885')" id="defaultOpen">
                <span>手术排班</span>
            </button>
            @*<button class="tablink" onclick="openPage('register', this, '#b7d7e8')">
                <span>手术登记</span>
            </button>*@

            <div id="arrange" class="tabcontent row" >
                <form id="formarrange" class="form-horizontal col-sm-12" role="form">
                    <div class="panel-heading" style="border-bottom-color:#90cbb7;border-bottom-left-radius:20px;">
                        <span class="glyphicon glyphicon-tags" style="color: rgb(255, 140, 60);"></span>
                        <span style="font-weight:bold;font-size:14px;padding-left:10px;">手术安排</span>
                    </div>
                    <div class="form-group" style="padding-top:5px;">
                        <label class="col-sm-2 control-label"><span class="required">*</span>拟手术名称：</label>
                        <div class="col-sm-9" style="height:20%;">
                            <select id="sel_ssmc" name="sel_ssmc" class="form-control" multiple="multiple" disabled>
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label"><span class="required">*</span>手术时间：</label>
                        <div class="col-sm-3">
                            <input id="sssj2" type="text" class="form-control input-wdatepicker formClearIgnore required" value="" onfocus="WdatePicker({ dateFmt: 'yyyy-MM-dd' })" />
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">麻醉方式：</label>
                        <div class="col-sm-3">
                            <select id="mzfs" name="mzfs" class="form-control required">
                                <option value="">===请选择=== </option>
                                <option value="1"> 全身麻醉 </option>
                                <option value="2">局部麻醉</option>
                                <option value="3">针刺麻醉</option>
                                <option value="4">复合麻醉</option>
                            </select>
                        </div>
                        <label class="col-sm-2 control-label">手术部位：</label>
                        <div class="col-sm-2">
                            <input id="ssbw" type="text" class="form-control" />
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label"><span class="required">*</span>手术室：</label>
                        <div class="col-sm-3">
                            <select id="oproom" name="oproom" class="form-control required">
                                <option value="">===请选择=== </option>
                            </select>
                        </div>
                        <label class="col-sm-2 control-label">台次：</label>
                        <div class="col-sm-3">
                            <input id="sstc" type="text" class="form-control" />
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label"><span class="required">*</span>是否隔离：</label>
                        <div class="col-sm-2">
                            <select id="isgl" name="isgl" class="form-control required">
                                <option value="2">否</option>
                                <option value="1">是 </option>

                            </select>
                        </div>
                    </div>
                    <div class="panel-heading" style="border-bottom-color:#90cbb7;border-bottom-left-radius:20px;">
                        <span class="glyphicon glyphicon-tags" style="color: rgb(255, 140, 60);"></span>
                        <span style="font-weight:bold;font-size:14px;padding-left:10px;">医护人员安排</span>
                    </div>
                    <div class="form-group" style="padding-top:5px;">
                        <label class="col-sm-2 control-label"><span class="required">*</span>主刀医生：</label>
                        <div class="col-sm-2">
                            <input id="code1" class="required" type="hidden" />
                            <input id="ysgh" attr-code="" attr-zjm="" name="ysgh" type="text" class="form-control required" autocomplete="off" />
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">一助：</label>
                        <div class="col-sm-2">
                            <input id="zlys1" type="hidden" />
                            <input id="zlys1name" attr-code="" attr-zjm="" name="zlys1name" type="text" class="form-control" autocomplete="off" />
                        </div>
                        <label class="col-sm-2 control-label">二助：</label>
                        <div class="col-sm-2">
                            <input id="zlys2" type="hidden" />
                            <input id="zlys2name" attr-code="" attr-zjm="" name="zlys2name" type="text" class="form-control" autocomplete="off" />
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">巡回护士：</label>
                        <div class="col-sm-2">
                            <input id="xhhs" type="hidden" />
                            <input id="xhhsname" attr-code="" attr-zjm="" name="xhhsname" type="text" class="form-control" autocomplete="off" />
                        </div>
                        <label class="col-sm-2 control-label">洗手护士：</label>
                        <div class="col-sm-2">
                            <input id="xshs" type="hidden" />
                            <input id="xshsname" attr-code="" attr-zjm="" name="xshsname" type="text" class="form-control" autocomplete="off" />
                        </div>

                    </div>
                    <div class="panel-heading" style="border-bottom-color:#90cbb7;border-bottom-left-radius:20px;">
                        <span class="glyphicon glyphicon-tags" style="color: rgb(255, 140, 60);"></span>
                        <span style="font-weight:bold;font-size:14px;padding-left:10px;">请仔细核对以上手术安排</span>
                    </div>
                    <div class="form-group" style="padding-top:25px;">
                        <div class="col-sm-3">
                        </div>
                        <div class="col-sm-3" id="submit">
                            <a class='btn btn-default  btn-lg  btn-block' style="border: 1px solid #398439; color: #398439;" onclick="submitArrange();"><i class="fa fa-check"></i> 保存排班</a>
                        </div>
                        <div class="col-sm-2">
                        </div>
                        <div class="col-sm-3" id="cancel">
                            <a class='btn btn-default btn-lg  btn-block' style="border: 1px solid #ac2925; color: #ac2925;" onclick="cancelArrange();"><i class="fa fa-remove"></i> 取消排班</a>
                        </div>
                    </div>
                    @*<div class="form-group">
                        <div class="col-sm-8">
                        </div>
                        <div class="col-sm-3" id="print">
                            <a class='btn btn-default btn-lg btn-block' style="border: 1px solid #398439;" onclick="printArrange();"><i class="fa fa-angle-double-left"></i> 打印通知单</a>
                        </div>
                    </div>*@
                </form>



            </div>

            @*<div id="register" class="tabcontent">
                <h3>News</h3>
                <p>Some news this fine day!</p>
            </div>*@




        </div>
    </div>
</div>


<script>
    var zyh = $.request("zyh");
    var ApplyId = $.request("keyValue");
    $(function () {
        $("#btn_opapply").hide();
        PatInit(zyh);
        getApplyInfo();
        getArrangeInfo();
        getSelectBind();
        var tablinkHeight = $(".tablink").height;
        $("#arrange").attr();
    });
    function OperationDicAjax(ssdmArray) {
        $.najax({
            url: "/Operation/Common/GetOperationAjax",
            data: { ssdm: !!ssdmArray ? ssdmArray.join(",") : null },
            dataType: "json",
            success: function (data) {
                if (data.length > 0) {
                    var selData = $("#sel_ssmc").val();
                    if (ssdmArray != null && ssdmArray.length > 0 && (!selData || (!!selData && selData.length != ssdmArray.length))) {
                        var array = [];
                        $.each(data, function () {
                            var option = new Option(this.ssmc, this.ssdm, true, true);
                            $Operations.append(option);
                        });

                        $Operations.trigger("change");
                    }
                }
            }
        });
    }
    var $Operations = $("#sel_ssmc").select2({
        language: "zh-CN",
        allowClear: true,
        ajax: {
            url: "/Operation/Common/GetOperations",
            delay: 250,
            data: function (params) {
                var query = {
                    ssdmData: params.term
                }
                return query;
            },
            processResults: function (data) {
                return processResultsData(data);
            },
            cache: true,
        },
    });

    function processResultsData(resultData) {
        //返回最终数据data 给dataArray
        var jsonObj = JSON.parse(resultData);
        var dataArray = [];
        for (var i = 0; i < resultData.length; i++) {
            var dataObj = {};
            if (!!jsonObj[i]) {
                dataObj.id = jsonObj[i].ssdm;
                dataObj.text = jsonObj[i].ssmc;
                dataArray.push(dataObj);
            }
        }
        return {
            results: dataArray
        };
    }
    function patchangeRefresh() {

    }
    function openPage(pageName, elmnt, color) {
        // 默认情况下，使用class=“tabcontent”隐藏所有元素
        var i, tabcontent, tablinks;
        tabcontent = document.getElementsByClassName("tabcontent");
        for (i = 0; i < tabcontent.length; i++) {
            tabcontent[i].style.display = "none";
        }

        // 删除所有标签链接/按钮的背景色
        tablinks = document.getElementsByClassName("tablink");
        for (i = 0; i < tablinks.length; i++) {
            tablinks[i].style.backgroundColor = "";
        }

        // 显示特定选项卡内容
        document.getElementById(pageName).style.display = "block";

        // 将特定颜色添加到用于打开选项卡内容的按钮
        elmnt.style.backgroundColor = color;
    }

    // 获取id为=“defaultOpen”的元素并单击它
    document.getElementById("defaultOpen").click();

    var applyInfo = {};
    function getApplyInfo() {
        $.ajax({
            url: "/Operation/OpArrangement/GetApplyInfoByKey?keyValue=" + ApplyId,
            data: { keyValue: "" },
            dataType: "json",
            success: function (data) {
                //手术申请信息
                arrangeInfo = data;

                $("#ysxm").val(data.ysxm);
                $("#sssj").val(data.sssj.replace("T", " "));
                $("#sqzt").val(data.sqzt);
                $("#applyno").val(data.Applyno);
                applyno = data.Applyno;
                if (data.ss != null && data.ss.length > 0) {
                    var ssdmArr = [];
                    var ssmcArr = [];
                    $.each(data.ss, function () {
                        ssdmArr.push(this.ssdm);
                        ssmcArr.push(this.ssmc);
                    });

                    OperationDicAjax(ssdmArr);
                    $("#sel_ssmc").val(ssdmArr).trigger("change");
                }
                if (!!data.ssmcn) {
                    $("#ssmcn").val(data.ssmcn);
                }
                else {
                    $("#ssmcn").val(ssmcArr[0]);
                }

            }
        });
    }

    /****************手术排班*********** */
    function getSelectBind() {
        $("#oproom").bindSelect({
            url: "/Operation/Common/GetRoomlist",
            id: "Code",
            text: "Name",
            minimumResultsForSearch: 0
        });
        $("#mzfs").bindSelect({
            url: "/Operation/Common/GetAneslist",
            id: "AnesCode",
            text: "AnesName"
        });
        $("#ysgh").staffFloatingSelector({
            organizeId: '',
            width: 200,
            itemdbclickhandler: function ($this) {
                $("#ysgh").val($this.attr('data-name')).attr("attr-code", $this.attr('data-id')).attr("attr-zjm", $this.attr('data-zjm'));
                var name = $("#code1").val($this.attr('data-name')).val();
                var code = $("#code1").val($this.attr('data-code')).val();
                $("#ysgh").html(name);
                $("#code1").html(code);
            }
        });
        $("#zlys1name").staffFloatingSelector({
            organizeId: '',
            width: 200,
            itemdbclickhandler: function ($this) {
                $("#zlys1name").val($this.attr('data-name')).attr("attr-code", $this.attr('data-id')).attr("attr-zjm", $this.attr('data-zjm'));
                var name = $("#zlys1").val($this.attr('data-name')).val();
                var code = $("#zlys1").val($this.attr('data-code')).val();
                $("#zlys1name").html(name);
                $("#zlys1").html(code);
            }
        });
        $("#zlys2name").staffFloatingSelector({
            organizeId: '',
            width: 200,
            itemdbclickhandler: function ($this) {
                $("#zlys2name").val($this.attr('data-name')).attr("attr-code", $this.attr('data-id')).attr("attr-zjm", $this.attr('data-zjm'));
                var name = $("#zlys2").val($this.attr('data-name')).val();
                var code = $("#zlys2").val($this.attr('data-code')).val();
                $("#zlys2name").html(name);
                $("#zlys2").html(code);
            }
        });
        $("#xhhsname").staffFloatingSelector({
            organizeId: '',
            width: 200,
            itemdbclickhandler: function ($this) {
                $("#xhhsname").val($this.attr('data-name')).attr("attr-code", $this.attr('data-id')).attr("attr-zjm", $this.attr('data-zjm'));
                var name = $("#xhhs").val($this.attr('data-name')).val();
                var code = $("#xhhs").val($this.attr('data-code')).val();
                $("#xhhsname").html(name);
                $("#xhhs").html(code);
            }
        });
        $("#xshsname").staffFloatingSelector({
            organizeId: '',
            width: 200,
            itemdbclickhandler: function ($this) {
                $("#xshsname").val($this.attr('data-name')).attr("attr-code", $this.attr('data-id')).attr("attr-zjm", $this.attr('data-zjm'));
                var name = $("#xshs").val($this.attr('data-name')).val();
                var code = $("#xshs").val($this.attr('data-code')).val();
                $("#xshsname").html(name);
                $("#xshs").html(code);
            }
        });
    }

    var arrangeInfo = {};
    function getArrangeInfo() {
	    $.ajax({
		    url: "/Operation/OpArrangement/GetArrangeObjByApplyId?ApplyId=" + ApplyId,
		    dataType: "json",
		    success: function (data) {
                $("#formarrange").formSerialize(data);
			    //手术排班信息
			    if (data.sssj != null) {
				    $("#sssj2").val(data.sssj.replace("T", " "));
			    }
                $("#mzfs").val(data.AnesCode).trigger("change");
                $("#code1").val(data.ysgh);
			    $("#ysgh").val(data.ysxm);
                $("#zlys1").val(data.zlys1);
                $("#zlys2").val(data.zlys2);
                $("#zlys1name").val(data.zlys1name);
                $("#zlys2name").val(data.zlys2name);
                $("#xshsname").val(data.xshsname);
                $("#xhhsname").val(data.xhhsname);
                $("#xshs").val(data.xshs);
                $("#xhhs").val(data.xhhs);
			    $("#ssbw").val(data.ssbw);
			    $("#sstc").val(data.oporder);
			    //按钮显示隐藏
			    if (data.sqzt == '@((int)EnumSSzt.dpb)') {
				    $("#cancel").hide();
                    $("#submit").show();
                   /* $("#print").hide();*/
			    } else if (data.sqzt == '@((int)EnumSSzt.ypb)') {
				    $("#cancel").show();
                    $("#submit").show();
                   /* $("#print").show();*/
			    } else if (data.sqzt == '@((int)EnumSSzt.yzf)') {
				    $("#cancel").hide();
                    $("#submit").hide();
                    /*$("#print").hide();*/
                } else if (data.sqzt == '@((int)EnumSSzt.yzx)')
                {
                    $("#cancel").hide();
                    $("#submit").hide();
                   /* $("#print").show();*/
                }
                else {
				    $("#cancel").hide();
                    $("#submit").show();
                    /*$("#print").hide();*/
			    }
		    }
	    });
    }
    //保存排班
    function submitArrange() {
        var arrangeObj = {
            ApplyId: arrangeInfo.Id,
            Applyno: arrangeInfo.Applyno,
            ssxh: arrangeInfo.ssdm,
            zyh: arrangeInfo.zyh,
            xm: arrangeInfo.xm,
            ks: arrangeInfo.ks,
            bq: arrangeInfo.bq,
            ch: arrangeInfo.ch,
            zd: arrangeInfo.zd,
            sqzt: 2,
            ssmc: arrangeInfo.ssmcn,
            ssdm: arrangeInfo.ssdm,
            //sssj: arrangeInfo.sssj,
            sssj: $("#sssj2").val(),
            ysgh: $("#code1").val() == "" ? arrangeInfo.ysgh : $("#code1").val(),
            ysxm: $("#ysgh").val(),
            AnesCode: $("#mzfs").val(),
            oproom: $("#oproom").val(),
            oporder: $("#sstc").val(),
            zlys1: $("#zlys1").val(),
            zlys2: $("#zlys2").val(),
            zlys3: null,
            zlys4: null,
            xhhs: $("#xhhs").val(),
            xshs: $("#xshs").val(),
            ssbw: $("#ssbw").val(),
            zt: 1,
        }
        if (arrangeObj.sssj == "" || arrangeObj.oproom == "" || !arrangeObj.ysgh || !arrangeObj.ysxm) {
            $.modalAlert("请填写手术时间、手术室、主刀医生", 'warning');
            return false;
        }

            //不可填
            $("#sssj2").attr("disabled", "disabled");
            $("#mzfs").attr("disabled", "disabled");
            $("#ssbw").attr("readonly", true);
            $("#oproom").attr("disabled", "disabled");
            $("#sstc").attr("readonly", true);;
            $("#isgl").attr("disabled", "disabled");
            $("#ysgh").attr("disabled", "disabled");
            $("#zlys1").attr("disabled", "disabled");
            $("#zlys2").attr("disabled", "disabled");
            $("#xhhs").attr("disabled", "disabled");
            $("#xshs").attr("disabled", "disabled");
            var keyValue = $.request("keyValue");

            $.submitForm({
                url: "/Operation/OpArrangement/submitForm?keyValue=" + keyValue,
                param: arrangeObj,
                success: function () {
                    location.reload();
                }
            });


    }
    //取消排班
    function cancelArrange() {
        $.modalConfirm("确定要取消吗？", function (flag) {
            if (!flag) {
                return false;
            }
            return true;
        });
        var keyValue = $.request("keyValue");
        if (!!!keyValue) {
            window.$.modalAlert("取消安排失败", 'warning');
            return false;
        }
        $.deleteForm({
            url: "/Operation/OpArrangement/DeleteForm",
            param: { keyValue: keyValue },
            success: function () {
                $.modalMsg("取消成功", "success");
                getArrangeInfo();
            }
        });
        return true;
    }

</script>

